<template>
    <div>
      <!--banner区域 -->
      <detail-banner></detail-banner>
      <!--header区域 -->
      <detail-header></detail-header>
      <!--列表区域 -->
      <detail-list :list="detailList.categoryList"></detail-list>
    </div>
</template>

<script>
import DetailBanner from './DetailBanner'
import DetailHeader from './DetailHeader'
import DetailList from './DetailList'
import { mapState } from 'vuex'

export default {
  name: 'Detail',
  components: {
    DetailBanner,
    DetailHeader,
    DetailList
  },
  mounted () {
    this.$store.dispatch('getDetailList', this.$route.params.id)
  },
  computed: {
    ...mapState(['detailList'])
  }
}
</script>

<style lang="stylus" scoped>

</style>
